<template>
  <div>
    <div>
    B组件界面
    <div>
      <a href="https://vitejs.dev" target="_blank">
        <img src="/vite.svg" class="logo" alt="Vite logo" />
      </a>
      <a href="https://vuejs.org/" target="_blank">
        <img src="@/assets/vue.svg" class="logo vue hvr-grow-rotate" alt="Vue logo" />
      </a>
    </div>
    <div class="item animate__bounce animate__animated" @click="go">跳转登录页</div>
    <el-button type="primary">Primary</el-button>
    <div>展示pinia的counter的count值：{{counterStore.count}}</div>
    <h2>doubleCount:{{counterStore.doubleCount}}</h2>
  </div>
  </div>
</template>

<script setup lang="ts">
import { useRouter } from "vue-router";
// 首先需要引入一下我们刚刚创建的store
import useCounter from '../stores/counter'
// 因为是个方法，所以我们得调用一下
const counterStore = useCounter()
const router = useRouter();
const go = () => {
  router.push({
    path: "/signup",
  });
};
</script>

<style lang="scss" scoped>
.logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
  transition: filter 300ms;
}
.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
  filter: drop-shadow(0 0 2em #42b883aa);
}
.item{
  color:$main_clolr;
  cursor:pointer;
  font-size:0.2rem;
}
</style>